<template>
  <ImageUploader
    class="avatar-uploader"
    :model-value="modelValue"
    :action="action"
    :preview-height="size"
    :style="{ width: size, height: size }"
    @update:modelValue="$emit('update:modelValue', $event)"
  />
</template>

<script>
import ImageUploader from '@/components/common/ImageUploader'

export default {
  name: 'AvatarUploader',
  components: { ImageUploader },
  props: {
    // 尺寸
    size: {
      default: '178px'
    },
    // 接口地址
    action: {},
    // 头像fileKey
    modelValue: {}
  }
}
</script>

<style scoped lang="scss">
.avatar-uploader {
  border-radius: 50%;
  overflow: hidden;
  :deep(.el-upload) {
    border: 0;
  }
  :deep(.image-previewer) {
    border-radius: 50%;
    object-fit: cover;
  }
}
</style>
